<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	    		xmlns:ui="http://java.sun.com/jsf/facelets"
	  			xmlns:h="http://java.sun.com/jsf/html"
	  			xmlns:f="http://java.sun.com/jsf/core"
				template="/WEB-INF/layouts/standard.xhtml">

<ui:define name="title">JSF 2 ajax with commandButton and f:ajax</ui:define>

<ui:define name="notes">
	<h5>Files to review:</h5>
	<p>
	  	Flow definition and view.xhtml in <span class="alt">src/main/webapp/WEB-INF/flows/ajax-jsf</span><br/>
	  	Java classes <span class="alt">~/ajax/UserBean.java</span>, <span class="alt">~/jsf/FacesHelper.java</span>
	</p>
	<hr/>
</ui:define>

<ui:define name="content">
	<h:form class="span-10">
		<fieldset>
			<legend>User Details</legend>
			<h:panelGroup layout="block" styleClass="error" rendered="#{facesHelper.error}">
				<h:messages />
			</h:panelGroup>
			<h:panelGroup layout="block" styleClass="success" rendered="${not empty emailSuggestion}">
				<h:outputLabel for="email">Email suggestion: </h:outputLabel>
				<h:outputText id="email" value="${emailSuggestion}"/>
			</h:panelGroup>
			<p>
				<h:outputLabel for="firstName">First Name: </h:outputLabel><br/>
				<h:inputText id="firstName" value="#{userBean.firstName}" />
			</p>
			<p>
				<h:outputLabel for="lastName">Last Name: </h:outputLabel><br/>
				<h:inputText id="lastName" value="#{userBean.lastName}" />
			</p>
		</fieldset>
		<p>
			<h:commandButton value="Suggest" action="suggest">
				<f:ajax execute="@form" render="@form" />
			</h:commandButton>
			<h:commandButton value="Exit" action="exit" />
		</p>
<pre><span class="alt">&lt;h:commandButton value="Suggest" action="suggest" &gt;</span>
    <span class="alt">&lt;f:ajax execute="@form" render="@form" /&gt;</span>
<span class="alt">&lt;h:commandButton/&gt;</span></pre>		
	</h:form>
</ui:define>

</ui:composition>